TypeScript Aniq Tiplari: Mustahkam Kod uchun Ob'ekt Shaklini Qat'iy Moslashtirish

JavaScript'ning ustki to'plami bo'lgan TypeScript veb-dasturlashning dinamik dunyosiga statik tiplashtirishni olib keladi. TypeScript tip xavfsizligi va kodni qo'llab-quvvatlashda sezilarli afzalliklarni taqdim etsa-da, uning strukturaviy tiplashtirish tizimi ba'zan kutilmagan harakatlarga olib kelishi mumkin. Aynan shu yerda "aniq tiplar" tushunchasi paydo bo'ladi. TypeScript'da "aniq tiplar" deb nomlangan o'rnatilgan xususiyat bo'lmasa-da, biz TypeScript xususiyatlari va usullari kombinatsiyasi orqali shunga o'xshash natijaga erishishimiz mumkin. Ushbu blog posti kodning mustahkamligini oshirish va keng tarqalgan xatolarning oldini olish uchun TypeScript'da ob'ekt shaklini qat'iyroq moslashtirishni qanday amalga oshirishni batafsil ko'rib chiqadi.

TypeScript'ning Strukturaviy Tiplashtirishini Tushunish

TypeScript strukturaviy tiplashtirishdan (shuningdek, o'rdak tiplashtirish deb ham ataladi) foydalanadi, bu tiplarning mosligi ularning e'lon qilingan nomlariga emas, balki tiplarning a'zolariga qarab aniqlanishini anglatadi. Agar ob'ektda biror tip talab qiladigan barcha xususiyatlar mavjud bo'lsa, u qo'shimcha xususiyatlarga ega bo'lishidan qat'i nazar, o'sha tipga mos keladi deb hisoblanadi.

Masalan:

interface Point {
  x: number;
  y: number;
}

const myPoint = { x: 10, y: 20, z: 30 };

function printPoint(point: Point) {
  console.log(`X: ${point.x}, Y: ${point.y}`);
}

printPoint(myPoint); // Bu yaxshi ishlaydi, garchi myPoint'da 'z' xususiyati bo'lsa ham

Bu holatda, TypeScript `myPoint` obyektini `printPoint` funksiyasiga uzatishga ruxsat beradi, chunki unda talab qilingan `x` va `y` xususiyatlari mavjud, garchi unda ortiqcha `z` xususiyati bo'lsa ham. Bunday moslashuvchanlik qulay bo'lishi mumkin bo'lsa-da, agar siz beixtiyor kutilmagan xususiyatlarga ega ob'ektlarni uzatsangiz, bu sezilmaydigan xatoliklarga olib kelishi mumkin.

Ortiqcha Xususiyatlar Bilan Bog'liq Muammo

Strukturaviy tiplashtirishning yumshoqligi ba'zan xatolarni yashirishi mumkin. Konfiguratsiya ob'ektini kutadigan funksiyani ko'rib chiqaylik:

interface Config {
  apiUrl: string;
  timeout: number;
}

function setup(config: Config) {
  console.log(`API URL: ${config.apiUrl}`);
  console.log(`Timeout: ${config.timeout}`);
}

const myConfig = { apiUrl: "https://api.example.com", timeout: 5000, typo: true };

setup(myConfig); // TypeScript bu yerda xatolik bermaydi!

console.log(myConfig.typo); //true ni chiqaradi. Ortiqcha xususiyat bildirmasdan mavjud bo'ladi

Ushbu misolda `myConfig` ob'ektida `typo` nomli ortiqcha xususiyat mavjud. TypeScript xatolik chiqarmaydi, chunki `myConfig` hali ham `Config` interfeysiga mos keladi. Biroq, imlo xatosi hech qachon aniqlanmaydi va agar bu xato `typoo` bo'lishi kerak bo'lgan bo'lsa, dastur kutilganidek ishlamasligi mumkin. Bu arzimas bo'lib tuyulgan muammolar murakkab dasturlarni tuzatishda katta bosh og'rig'iga aylanishi mumkin. Ichma-ich joylashgan ob'ektlar bilan ishlaganda yo'qolgan yoki noto'g'ri yozilgan xususiyatni aniqlash ayniqsa qiyin bo'lishi mumkin.

TypeScript'da Aniq Tiplarni Amalga Oshirish Usullari

TypeScript'da haqiqiy "aniq tiplar" to'g'ridan-to'g'ri mavjud bo'lmasa-da, shunga o'xshash natijalarga erishish va ob'ekt shaklini qat'iyroq moslashtirishni ta'minlash uchun bir nechta usullar mavjud:

1. `Omit` bilan Tip Tasdiqlaridan Foydalanish

`Omit` yordamchi tipi mavjud tipdan ma'lum xususiyatlarni chiqarib tashlab, yangi tip yaratishga imkon beradi. Tip tasdiqlari bilan birgalikda bu ortiqcha xususiyatlarning oldini olishga yordam beradi.

interface Point {
  x: number;
  y: number;
}

const myPoint = { x: 10, y: 20, z: 30 };

// Faqat Point xususiyatlarini o'z ichiga olgan tip yaratish
const exactPoint: Point = myPoint as Omit & Point;

// Xato: '{ x: number; y: number; z: number; }' tipi 'Point' tipiga tayinlanmaydi.
// Ob'ekt literali faqat ma'lum xususiyatlarni belgilashi mumkin va 'z' 'Point' tipida mavjud emas.

function printPoint(point: Point) {
  console.log(`X: ${point.x}, Y: ${point.y}`);
}


//Tuzatish
const myPointCorrect = { x: 10, y: 20 };
const exactPointCorrect: Point = myPointCorrect as Omit & Point;
printPoint(exactPointCorrect);

Bu usul, agar `myPoint` ob'ektida `Point` interfeysida aniqlanmagan xususiyatlar bo'lsa, xatolik chiqaradi.

Tushuntirish: `Omit` `myPoint` tipidan `Point` tipida mavjud bo'lgan barcha kalitlarni olib tashlaydigan tip yaratadi. So'ngra `& Point` bu tipni `Point` tipi bilan kesishadi va ob'ektning `Point` tipiga mos kelishini talab qiladi. Ob'ektni ushbu birlashtirilgan tipga tasdiqlash orqali kompilyator ortiqcha xususiyatlarni tekshiradi va agar topilsa, xatolik chiqaradi. Bu bizni ob'ektni dastlabki aniqlashda to'g'ri shaklni e'lon qilishga majbur qiladi.

2. Ob'ekt Yaratish uchun Funksiyadan Foydalanish

Siz faqat interfeysda aniqlangan xususiyatlarni qabul qiladigan fabrika funksiyasini yaratishingiz mumkin. Bu usul ob'ekt yaratish nuqtasida kuchli tip tekshiruvini ta'minlaydi.

interface Config {
  apiUrl: string;
  timeout: number;
}

function createConfig(config: Config): Config {
  return {
    apiUrl: config.apiUrl,
    timeout: config.timeout,
  };
}

const myConfig = createConfig({ apiUrl: "https://api.example.com", timeout: 5000 });

//Bu kompilyatsiya qilinmaydi:
//const myConfigError = createConfig({ apiUrl: "https://api.example.com", timeout: 5000, typo: true });
//'{ apiUrl: string; timeout: number; typo: true; }' tipidagi argument 'Config' tipidagi parametrga tayinlanmaydi.
// Ob'ekt literali faqat ma'lum xususiyatlarni belgilashi mumkin va 'typo' 'Config' tipida mavjud emas.

Faqat `Config` interfeysida aniqlangan xususiyatlar bilan tuzilgan ob'ektni qaytarish orqali siz hech qanday ortiqcha xususiyatlar kiritilmasligini ta'minlaysiz. Bu konfiguratsiyani yaratishni xavfsizroq qiladi.

3. Tip Himoyachilaridan (Type Guards) Foydalanish

Tip himoyachilari - bu ma'lum bir doirada o'zgaruvchining tipini toraytiradigan funksiyalardir. Ular to'g'ridan-to'g'ri ortiqcha xususiyatlarning oldini olmasa-da, ularni aniq tekshirish va tegishli choralarni ko'rishga yordam beradi.

interface User {
  id: number;
  name: string;
}

function isUser(obj: any): obj is User {
  return (
    typeof obj === 'object' &&
    obj !== null &&
    'id' in obj && typeof obj.id === 'number' &&
    'name' in obj && typeof obj.name === 'string' &&
    Object.keys(obj).length === 2 //kalitlar sonini tekshirish. Eslatma: mo'rt va User'ning aniq kalitlar soniga bog'liq.
  );
}

const potentialUser1 = { id: 123, name: "Alice" };
const potentialUser2 = { id: 456, name: "Bob", extra: true };

if (isUser(potentialUser1)) {
  console.log("Valid User:", potentialUser1.name);
} else {
  console.log("Invalid User");
}

if (isUser(potentialUser2)) {
  console.log("Valid User:", potentialUser2.name); //Bu yerga kirmaydi
} else {
  console.log("Invalid User");
}

Ushbu misolda `isUser` tip himoyachisi nafaqat talab qilingan xususiyatlarning mavjudligini, balki ularning tiplarini va xususiyatlarning *aniq* sonini ham tekshiradi. Bu usul ancha aniq bo'lib, noto'g'ri ob'ektlarni to'g'ri boshqarish imkonini beradi. Biroq, xususiyatlar sonini tekshirish mo'rt hisoblanadi. `User` tipiga xususiyatlar qo'shilsa yoki olib tashlansa, tekshiruvni yangilash kerak bo'ladi.

4. `Readonly` va `as const` dan Foydalanish

`Readonly` mavjud xususiyatlarni o'zgartirishni oldini olsa va `as const` barcha xususiyatlari chuqur o'qish uchun mo'ljallangan va literal tiplarga ega bo'lgan o'qish uchun mo'ljallangan kortej yoki ob'ekt yaratsa-da, ularni boshqa usullar bilan birgalikda yanada qat'iy ta'rif va tip tekshiruvini yaratish uchun ishlatish mumkin. Biroq, ularning hech biri o'z-o'zidan ortiqcha xususiyatlarning oldini olmaydi.

interface Options {
  width: number;
  height: number;
}

//Readonly tipini yaratish
type ReadonlyOptions = Readonly;

const options: ReadonlyOptions = { width: 100, height: 200 };

//options.width = 300; //xato: 'width'ga tayinlab bo'lmaydi, chunki u faqat o'qish uchun mo'ljallangan xususiyat.

//as const dan foydalanish
const config = { api_url: "https://example.com", timeout: 3000 } as const;

//config.timeout = 5000; //xato: 'timeout'ga tayinlab bo'lmaydi, chunki u faqat o'qish uchun mo'ljallangan xususiyat.

//Biroq, ortiqcha xususiyatlarga hali ham ruxsat beriladi:
const invalidOptions: ReadonlyOptions = { width: 100, height: 200, depth: 300 }; //xato yo'q. Hali ham ortiqcha xususiyatlarga ruxsat beradi.


interface StrictOptions {
  readonly width: number;
  readonly height: number;
}

//Endi bu xatolik beradi:
//const invalidStrictOptions: StrictOptions = { width: 100, height: 200, depth: 300 };
//'{ width: number; height: number; depth: number; }' tipi 'StrictOptions' tipiga tayinlanmaydi.
//  Ob'ekt literali faqat ma'lum xususiyatlarni belgilashi mumkin va 'depth' 'StrictOptions' tipida mavjud emas.

Bu o'zgarmaslikni (immutability) yaxshilaydi, lekin faqat mutatsiyaning oldini oladi, ortiqcha xususiyatlarning mavjudligini emas. `Omit` yoki funksiya usuli bilan birgalikda u yanada samaraliroq bo'ladi.

5. Kutubxonalardan Foydalanish (masalan, Zod, io-ts)

Zod va io-ts kabi kutubxonalar kuchli runtime (ishlash vaqti) tip tekshiruvi va sxema aniqlash imkoniyatlarini taqdim etadi. Ushbu kutubxonalar sizning ma'lumotlaringizning kutilgan shaklini aniq tasvirlaydigan, shu jumladan ortiqcha xususiyatlarning oldini oladigan sxemalarni aniqlashga imkon beradi. Ular runtime bog'liqligini qo'shsa-da, juda mustahkam va moslashuvchan yechimni taklif qiladi.

Zod bilan misol:

import { z } from 'zod';

const UserSchema = z.object({
  id: z.number(),
  name: z.string(),
});

type User = z.infer;

const validUser = { id: 1, name: "John" };
const invalidUser = { id: 2, name: "Jane", extra: true };

const parsedValidUser = UserSchema.parse(validUser);
console.log("Parsed Valid User:", parsedValidUser);

try {
  const parsedInvalidUser = UserSchema.parse(invalidUser);
  console.log("Parsed Invalid User:", parsedInvalidUser); // Bu yerga yetib kelmaydi
} catch (error) {
  console.error("Validation Error:", error.errors);
}

Zod'ning `parse` metodi, agar kiruvchi ma'lumotlar sxemaga mos kelmasa, xatolik chiqaradi va shu bilan ortiqcha xususiyatlarning oldini oladi. Bu runtime tekshiruvini ta'minlaydi va shuningdek, sxemadan TypeScript tiplarini yaratadi, bu sizning tip ta'riflaringiz va runtime tekshiruv mantig'i o'rtasidagi izchillikni ta'minlaydi.

Aniq Tiplarni Amalga Oshirishning Eng Yaxshi Amaliyotlari

TypeScript'da ob'ekt shaklini qat'iyroq moslashtirishni amalga oshirishda e'tiborga olish kerak bo'lgan ba'zi eng yaxshi amaliyotlar:

• To'g'ri usulni tanlang: Eng yaxshi yondashuv sizning maxsus ehtiyojlaringiz va loyiha talablariga bog'liq. Oddiy holatlar uchun `Omit` bilan tip tasdiqlari yoki fabrika funksiyalari yetarli bo'lishi mumkin. Murakkabroq holatlar yoki runtime tekshiruvi talab qilinganda Zod yoki io-ts kabi kutubxonalardan foydalanishni ko'rib chiqing.
• Izchil bo'ling: Bir xil darajadagi tip xavfsizligini saqlash uchun tanlangan yondashuvingizni butun kod bazasi bo'ylab izchil qo'llang.
• Tiplaringizni hujjatlashtiring: Ma'lumotlaringizning kutilgan shaklini boshqa dasturchilarga yetkazish uchun interfeyslar va tiplaringizni aniq hujjatlashtiring.
• Kodingizni sinovdan o'tkazing: Tip cheklovlari kutilganidek ishlayotganini va kodingiz noto'g'ri ma'lumotlarni to'g'ri boshqarayotganini tekshirish uchun birlik testlarini yozing.
• Murosani ko'rib chiqing: Ob'ekt shaklini qat'iyroq moslashtirish kodingizni yanada mustahkam qilishi mumkin, lekin u ishlab chiqish vaqtini ham oshirishi mumkin. Afzalliklar va xarajatlarni taqqoslang va loyihangiz uchun eng mantiqiy yondashuvni tanlang.
• Bosqichma-bosqich joriy etish: Agar siz katta mavjud kod bazasi ustida ishlayotgan bo'lsangiz, ushbu usullarni asta-sekin, dasturingizning eng muhim qismlaridan boshlab joriy etishni o'ylab ko'ring.
• Ob'ekt shakllarini aniqlashda tip taxalluslaridan ko'ra interfeyslarni afzal ko'ring: Interfeyslar odatda afzalroqdir, chunki ular deklaratsiyalarni birlashtirishni qo'llab-quvvatlaydi, bu turli fayllar bo'ylab tiplarni kengaytirish uchun foydali bo'lishi mumkin.

Haqiqiy Hayotdan Misollar

Aniq tiplar foydali bo'lishi mumkin bo'lgan ba'zi haqiqiy hayotiy holatlarni ko'rib chiqaylik:

• API so'rovlari yuklamalari (payloads): API ga ma'lumot yuborishda yuklamaning kutilgan sxemaga mos kelishini ta'minlash juda muhim. Aniq tiplarni qo'llash kutilmagan xususiyatlarni yuborish natijasida kelib chiqadigan xatolarning oldini oladi. Masalan, ko'plab to'lovlarni qayta ishlash API'lari kutilmagan ma'lumotlarga juda sezgir.
• Konfiguratsiya fayllari: Konfiguratsiya fayllari ko'pincha ko'p sonli xususiyatlarni o'z ichiga oladi va imlo xatolari tez-tez uchraydi. Aniq tiplardan foydalanish bu xatolarni erta aniqlashga yordam beradi. Agar siz bulutli joylashtirishda server joylashuvlarini sozlayotgan bo'lsangiz, joylashuv sozlamalaridagi imlo xatosi (masalan, eu-west-1 o'rniga eu-wet-1) oldindan aniqlanmasa, uni tuzatish juda qiyin bo'ladi.
• Ma'lumotlarni o'zgartirish quvurlari: Ma'lumotlarni bir formatdan boshqasiga o'zgartirishda, natijaviy ma'lumotlarning kutilgan sxemaga mos kelishini ta'minlash muhimdir.
• Xabarlar navbatlari: Xabarlar navbati orqali xabar yuborishda, xabar yuklamasining to'g'ri ekanligiga va kerakli xususiyatlarni o'z ichiga olganligiga ishonch hosil qilish muhimdir.

Misol: Xalqarolashtirish (i18n) Konfiguratsiyasi

Ko'p tilli dastur uchun tarjimalarni boshqarishni tasavvur qiling. Sizda shunga o'xshash konfiguratsiya ob'ekti bo'lishi mumkin:

interface Translation {
  greeting: string;
  farewell: string;
}

interface I18nConfig {
  locale: string;
  translations: Translation;
}

const englishConfig: I18nConfig = {
  locale: "en-US",
  translations: {
    greeting: "Hello",
    farewell: "Goodbye"
  }
};


//Bu muammo bo'ladi, chunki ortiqcha xususiyat mavjud bo'lib, bildirmasdan xatolik kiritadi.
const spanishConfig: I18nConfig = {
  locale: "es-ES",
  translations: {
    greeting: "Hola",
    farewell: "Adiós",
    typo: "unintentional translation"
  }
};

//Yechim: Omit'dan foydalanish
const spanishConfigCorrect: I18nConfig = {
  locale: "es-ES",
  translations: {
    greeting: "Hola",
    farewell: "Adiós"
  } as Omit & Translation
};

Aniq tiplarsiz, tarjima kalitidagi imlo xatosi (`typo` maydonini qo'shish kabi) e'tibordan chetda qolishi mumkin, bu esa foydalanuvchi interfeysida tarjimalarning yo'qolishiga olib keladi. Ob'ekt shaklini qat'iyroq moslashtirishni ta'minlash orqali siz bu xatolarni ishlab chiqish jarayonida aniqlashingiz va ularning production'ga chiqishining oldini olishingiz mumkin.

Xulosa

TypeScript'da o'rnatilgan "aniq tiplar" bo'lmasa-da, siz `Omit` bilan tip tasdiqlari, fabrika funksiyalari, tip himoyachilari, `Readonly`, `as const` kabi TypeScript xususiyatlari va usullari hamda Zod va io-ts kabi tashqi kutubxonalar kombinatsiyasidan foydalanib, shunga o'xshash natijalarga erishishingiz mumkin. Ob'ekt shaklini qat'iyroq moslashtirishni ta'minlash orqali siz kodingizning mustahkamligini oshirishingiz, keng tarqalgan xatolarning oldini olishingiz va dasturlaringizni yanada ishonchli qilishingiz mumkin. O'z ehtiyojlaringizga eng mos keladigan yondashuvni tanlashni va uni butun kod bazangizda izchil qo'llashni unutmang. Ushbu yondashuvlarni diqqat bilan ko'rib chiqib, siz dasturingiz tiplari ustidan ko'proq nazoratni qo'lga kiritishingiz va uzoq muddatli qo'llab-quvvatlashni oshirishingiz mumkin.